<template>
	<view>
		<!-- 问题s筛选列表 -->
		<TopNavCustom :title="node.partName"></TopNavCustom>
		<view class="container">
			<question-echart :all="sumList.totalCount" :wip="sumList.notPassCount" :ip='sumList.passCount'
				:nodeList='sumList.nodeList'>
			</question-echart>
			<u-picker :show="showPicker" :columns="columns" @confirm="confirmPicker" title="问题类别" @cancel="cancelPicker"
				keyName='name'>
			</u-picker>
			<view class="tab-content">
				<view class="top-title" @click.stop="()=>showPicker=true">
					<view class="left-tag">
						<text>{{filterData}}</text>
						<u-icon name="arrow-right"></u-icon>
					</view>
					<text class="right" @click.stop="showM">{{rightTitle}}</text>
				</view>
				<u-subsection :list="list" mode="subsection" :current="current" activeColor="transparent"
					@change="change" fontSize='30rpx'>
				</u-subsection>
				<!-- 上传列表 -->
				<view v-if="current ==0">
					<view v-if="progressListChecked.length!=0">
						<view class="upload-list" v-for="(item,qualityId) in progressListChecked" :key="qualityId">
							<data-checked-item :item="item"></data-checked-item>
						</view>
					</view>
					<view v-else>
						<u-empty text="暂无记录~" icon="/static/home_icons/nodata.png" marginTop="166rpx" width="200rpx"
							height="131rpx">
						</u-empty>
					</view>

				</view>

				<view class="upload-list" v-if="current===1">
					<!-- 循环输出列表 -->
					<view v-if="progressListUpload.length!=0">
						<view class="item-box">
							<u-checkbox-group :showCheckBox="showCheckbox" v-model="selectedQuestion" placement="column"
								size="30">
								<div v-for="(item, qualityId) in progressListUpload" :key="qualityId">
									<u-checkbox activeColor=" #E62029" :customStyle="{marginBottom: '8px'}"
										:name="item.qualityId" shape="circle">
										<view slot="content">
											<data-checked-item :item="item" :showCheckbox="showCheckbox">
											</data-checked-item>
										</view>
									</u-checkbox>
								</div>
							</u-checkbox-group>
						</view>
					</view>
					<!-- 为空数据时候 -->
					<view v-else>
						<u-empty text="暂无记录~" icon="/static/home_icons/nodata.png" marginTop="166rpx" width="200rpx"
							height="131rpx">
						</u-empty>
					</view>
				</view>
			</view>
		</view>

		<!-- 底部栏 -->
		<view class="bottom-line" v-if="showCheckbox">
			<!-- <u-radio-group> -->
			<u-radio @change="changeRadio" label="全选" activeColor="#E62029" size="28rpx"></u-radio>
			<!-- </u-radio-group> -->
			<view class="btns">
				<text class="rm" @click="deleteRecord">删除</text>
				<text class="out" @click="output">导出</text>
			</view>
		</view>
		<u-modal @cancel="cancelModal" :show="showModal" :title="modalTitle" :content='content' @confirm="confirm"
			:showCancelButton='true'>
		</u-modal>
	</view>
</template>

<script>
	import _utils from "@/common/_utils.js"
	import _question from "@/common/question.js"
	import _constant from "@/common/constant.js"
	import _file from '@/common/file.js'

	export default {
		onLoad(params) {
			this.node = JSON.parse(decodeURIComponent(params.item))
			// console.log(this.node)
			this.partId = this.node.partId
			this.estateId = this.node.estateId
			if (this.node.questionType == '质量问题') {
				this.issuesType = 1
				this.questionParentId = '1'
			} else {
				this.issuesType = 2
				this.questionParentId = '2'
			}
			this.getSum()
			// this.getProgressListUpload()
		},
		methods: {
			async getSum() {
				let _push_form = {}
				_push_form.estateId = this.estateId
				if (this.node.type == 'house') {
					_push_form.rootPartId = this.rootPartId
				} else {
					_push_form.partId = this.partId
				}
				_push_form.issuesType = this.issuesType
				this.sumList = await _question.getQuestionEchart(_push_form)
				//获取节点列表
				this.partOne = uni.$u.deepClone(this.sumList.nodeList)
				let element = {
					name: '全部',
					faultId: ""
				}
				this.partOne.unshift(element)
				this.columns = [this.partOne]
				console.log(this.columns)
				this.filterData = this.partOne[0].name
				// this.filterData = '全部'
				this.faultId = this.partOne[0].faultId
				console.log("faultId")
				this.getProgressListChecked()

				console.log(this.faultId)
			},
			//获取未整改的列表
			async getProgressListChecked() {
				console.log(this.node)
				let _push_form = {}
				if (this.node.type == 'house') {
					_push_form.rootPartId = this.rootPartId
				} else {
					_push_form.partId = this.partId
				}
				_push_form.estateId = this.estateId
				_push_form.statusList = [2, 4, 1, 11]
				_push_form.issuesType = this.issuesType
				_push_form.faultId = this.faultId
				console.log(_push_form)
				this.progressListChecked = await _question.getQuestionList(_push_form)
			},
			//获取已整改的列表
			async getProgressListUpload() {
				let _push_form = {}
				if (this.node.type == 'house') {
					_push_form.rootPartId = this.rootPartId
				} else {
					_push_form.partId = this.partId
				}
				_push_form.estateId = this.estateId
				_push_form.statusList = [3]
				_push_form.issuesType = this.issuesType
				_push_form.faultId = this.faultId
				this.progressListUpload = await _question.getQuestionList(_push_form)
			},
			cancelModal() {
				this.showModal = false
			},
			async confirm() {
				if (this.isDelete) {
					let flag = true
					for (let i = 0; i < this.selectedQuestion.length; i++) {
						let result = await _question.deleteQuestionRecord(this.selectedQuestion[i])
						if (!result) {
							flag = result
							break
						}
					}
					if (flag) {
						uni.$showMsg('删除成功！')
						uni.$u.sleep(1000).then(() => {
							this.showModal = false
							uni.switchTab({
								url: '/pages/idata/data/data'
							})
						})
					}

				} else {
					let _push_form = {}
					_push_form.estateId = this.estateId
					_push_form.issuesType = this.issuesType
					_push_form.issuesStatus = 3
					_push_form.estateIds = this.selectedQuestion
					const result = _constant.downloadURL(_push_form)
					if (result) {
						console.log(result)
						let path = _file.downloadAndSave(result)
						uni.$u.sleep(1000).then(() => {
							this.showModal = false
						})
						uni.$showMsg('请稍等...')
					}
				}
			},
			deleteRecord() {
				this.isDelete = true
				if (this.selectedQuestion.length) {
					this.modalTitle = '删除记录'
					this.content = '是否确认删除记录'
					this.showModal = true
				} else {
					uni.$showMsg('请选择删除项')
					return
				}
			},
			output() {
				this.isDelete = false
				if (this.selectedQuestion.length) {
					this.modalTitle = '导出记录'
					this.content = '是否确认导出记录'
					this.showModal = true
					// uni.$showMsg('导出失败')
					// console.log(this.selectedQuestion)
				} else {
					uni.$showMsg('请选择导出项')
					return
				}
			},
			changeRadio(item) {
				console.log(item)
				if (item) {
					let tempIds = []
					for (let i = 0; i < this.progressListUpload.length; i++) {
						tempIds.push(this.progressListUpload[i].qualityId)
						// this.progressListUpload[i].showCheckbox=true
					}
					this.selectedQuestion = tempIds
					console.log(tempIds)
				} else {
					this.selectedQuestion = []
				}
			},
			showM() {
				if (this.rightTitle === '导出' && this.current === 0) {
					uni.$showMsg('请先选择已整改')
					return
				}
				this.rightTitle = this.rightTitle === '取消' ? '导出' : '取消'
				this.showCheckbox = this.rightTitle === '取消'

			},
			change(index) {
				this.current = index
				if (!this.current) {
					this.showCheckbox = false
					this.rightTitle = '导出'
				}
				switch (index) {
					case 0:
						this.getProgressListChecked()
						break;
					case 1:
						this.getProgressListUpload()
						break;
				}
			},
			confirmPicker(item) {
				this.cancelPicker()
				this.filterData = item.value[0].name
				this.faultId = item.value[0].faultId
				this.getProgressListChecked()

			},
			cancelPicker() {
				this.showPicker = false
			}
		},
		data() {
			return {
				isDelete: false,
				questionParentId: '',
				issuesType: 0,
				sumList: [],
				node: null,
				faultId: '',
				//待整改列表
				toRectificationList: [],
				//已整改列表
				alreadyRectificationList: [],
				filterData: '',
				columns: [],
				showPicker: false,
				modalTitle: '删除记录',
				content: '是否确认删除记录',
				showModal: false,
				rightTitle: '导出',
				showCheckbox: false,
				selectedQuestion: [],
				failStatus: "待审核",
				time: uni.$u.timeFormat(false, 'yyyy-mm-dd'),
				title: '',
				current: 0,
				checkStatus: '审核中',
				list: [{
					name: '待整改',
				}, {
					name: '已整改',
				}],
				progressListChecked: [],
				progressListUpload: []
			};
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		padding: 20rpx 30rpx;

		.tab-content {
			background-color: #FFFFFF;
			margin-top: 20rpx;
			border-radius: 20rpx;
			border: 1rpx solid #efefef;
			padding: 30rpx;
			display: flex;
			flex-direction: column;

			.top-title {
				padding: 22rpx 0;
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				align-items: center;
				margin-bottom: 30rpx;

				.left-tag {
					display: inline-flex;
				}

				.right {
					display: inline-block;
					text-align: center;
					position: relative;
					height: 56rpx;
					line-height: 56rpx;
					width: 120rpx;
					background: #FFFFFF;
					border: 1rpx solid #E62029;
					border-radius: 28rpx;
					color: #E62029;
					font-size: 24rpx;
				}
			}

			.upload-list {
				display: flex;
				flex-direction: column;
			}
		}
	}

	.bottom-line {
		position: fixed;
		bottom: 0;
		width: 750rpx;
		height: 98rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 0rpx 15rpx 0rpx rgba(158, 158, 158, 0.15);
		display: flex;
		flex-direction: row;
		align-items: center;
		padding: 0 30rpx 0 30rpx;
		justify-content: space-between;

		.btns {
			display: inline-flex;
			flex-direction: row;
			justify-content: space-between;
			font-size: 28rpx;
			padding: 0 60rpx 0 0rpx;

			.out,
			.rm {
				display: inline-block;
				text-align: center;
				position: relative;
				width: 140rpx;
				height: 56rpx;
				line-height: 56rpx;
				border: 1rpx solid #E62029;
				border-radius: 28rpx;
				margin-right: 30rpx;
			}

			.rm {
				color: #E62029;
				background: #FFFFFF;

			}

			.out {
				color: #FFFFFF;
				background: linear-gradient(0deg, #E93423 0%, #FB6858 100%);
			}
		}
	}

	.container /deep/ .u-subsection--subsection {
		height: 80rpx;
		background: #EBEBEB;
		border-radius: 40rpx;
		border: 1rpx solid #F5FFF0;
	}

	.container /deep/ .u-subsection__bar {
		height: 80rpx !important;
		background: linear-gradient(0deg, #E93423 0%, #FB6858 100%);
		border-radius: 40rpx;
	}
</style>
